<!-- 新增编辑任务 -->
<template>
  <el-dialog
    :title="dialogTitle"
    :visible.sync="dialogVisible"
    width="35%"
    destroy-on-close
  >
    <div
      class="form-box"
      style="max-height: 500px; overflow: hidden; overflow-y: auto"
    >
      <el-form
        ref="operaDialogRef"
        :rules="rules"
        :model="dialogForm"
        label-width="120px"
      >
        <el-form-item label="任务名称：" prop="taskName">
          <el-input
            v-model="dialogForm.taskName"
            placeholder="请输入任务名称"
          />
        </el-form-item>
        <el-form-item label="任务说明：" prop="remark">
          <el-input v-model="dialogForm.remark" placeholder="请输入任务说明" />
        </el-form-item>
        <el-form-item label="任务类型：" prop="type">
          <el-radio-group v-model="dialogForm.taskType" class="ml-4">
            <el-radio :label="0">其他任务</el-radio>
            <el-radio :label="1">指标任务</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
    </div>

    <template #footer>
      <el-button @click="dialogVisible = false">取消</el-button>
      <el-button type="primary" @click="confirmDialog">确定</el-button>
    </template>
  </el-dialog>
</template>
<script>
export default {
  name: "OperaDialog",
  data() {
    return {
      dialogTitle: "新增任务",
      dialogVisible: false,
      // 提交信息
      dialogForm: {
        taskName: null,
        remark: null,
        taskType: 0,
      },
      rules: {
        taskName: [
          {
            required: true,
            message: "任务名称不能为空！",
            trigger: "blur",
          },
        ],
      },
    };
  },
  methods: {
    // 打开弹窗
    openDialog(info) {
      if (info) {
        this.dialogTitle = "编辑任务";
        this.dialogForm = {...info};
      } else {
        this.dialogTitle = "新增任务";
        this.dialogForm = {
          taskName: null,
          remark: null,
          taskType: 0,
        };
      }

      this.dialogVisible = true;
    },
    confirmDialog() {
      this.$refs.operaDialogRef.validate((valid, fields) => {
        if (valid) {
          this.$axios
            .post(
              this.$api.dataConnection.dataAggregation.operaTask,
              this.dialogForm
            )
            .then((res) => {
              if (res.data.code === 200) {
                this.$message.success(res.data.message || "操作成功");
                this.dialogVisible = false;
                this.$emit("reload");
              } else {
                this.$message.warning(res.data.message);
              }
            });
        }
      });
    },
  },
};
</script>
<style scoped></style>
